<template>
  <div class="lanjian-content" style="height: 760px;overflow: auto">
    <div class='singleRow'>
      <a-form-model
        ref="ruleForm1"
        :labelCol="labelCol"
        :wrapperCol="wrapperCol"
        :rules="rules"
        class='formbox'
        :model="ruleForm"
      >
        <a-form-model-item  class='formtab'
                            prop='fileList'
        >
          <a-upload
            :multiple="false"
            :file-list="ruleForm.fileList"
            :defaultFileList="ruleForm.fileList"
            :customRequest="customUpload"
            :before-upload="beforeFileUpload"
            :showUploadList="true"
            :remove="handleRemove"
            maxCount="{1}"
          ><span style="color: #000000d9;font-size: 18px;font-weight: 700; margin-right: 10px"><span style="color: #ff5500;font-size: 18px;">*</span>整改方案</span>
            <a-button>
              <a-icon type="upload"/>
              上传文件
            </a-button>
          </a-upload>
          <span>仅支持doc、docx、pdf、xls、xlsx、jpg、png、jpeg、txt、ext文件格式、文件大小不超过200M。</span>
        </a-form-model-item>
        <a-row>
          <a-col :span='8'>
            <a-form-model-item
              label='编辑人'
              class='formtab'
              prop='editor'
            >
              <a-input
                v-model.trim='ruleForm.editor'
                placeholder='请输入编辑人'
                :maxLength='200'
              />
            </a-form-model-item>
          </a-col>
          <a-col :span='8'>
            <a-form-model-item
              label='联系电话'
              class='formtab cus'
              prop='phone'
            >
              <a-input
                v-model.trim='ruleForm.phone'
                placeholder='请输入联系电话'
                :maxLength='200'
              />

            </a-form-model-item>

          </a-col>
        </a-row>
        <a-form-model-item label="派驻组评估情况">
          <a-textarea
            style="width: 100%;min-height: 100px"
            v-model:value='ruleForm.pzz_pg_infos'
            placeholder=""
            auto-size
            disabled="true"
            :rows="4"
          />
        </a-form-model-item>
        <a-row>
          <a-col :span='8'>
            <a-form-model-item
              label='编辑人'
              class='formtab'
              prop='pzz_editor'
            >
              <a-input
                v-model.trim='ruleForm.pzz_editor'
                placeholder=''
                :maxLength='200'
                disabled="true"
              />

            </a-form-model-item>
          </a-col>
          <a-col :span='8'>
            <a-form-model-item
              label='联系电话'
              class='formtab cus'
              prop='pzz_phone'
            >
              <a-input
                v-model.trim='ruleForm.pzz_phone'
                placeholder=''
                :maxLength='200'
                disabled="true"
              />
            </a-form-model-item>

          </a-col>
        </a-row>
        <a-form-model-item label="监督检查室评估情况">
          <a-textarea
            style="width: 100%;min-height: 100px"
            v-model.trim:value="ruleForm.jdjcs_pg_infos"
            placeholder=""

            disabled="true"
            autoSize
          />
        </a-form-model-item>
        <a-row>
          <a-col :span='8'>
            <a-form-model-item
              label='编辑人'
              class='formtab'
              prop='jdjcs_editor'
            >
              <a-input
                v-model.trim='ruleForm.jdjcs_editor'
                placeholder=''
                :maxLength='200'
                disabled="true"
              />
            </a-form-model-item>
          </a-col>
          <a-col :span='8'>
            <a-form-model-item
              label='联系电话'
              class='formtab cus'
              prop='jdjcs_phone'
            >
              <a-input
                v-model.trim='ruleForm.jdjcs_phone'
                placeholder=''
                :maxLength='200'
                disabled="true"
              />
            </a-form-model-item>

          </a-col>
        </a-row>
      </a-form-model>
    </div>

  </div>
</template>
<script>
import {getuploadFileInfo, addRectificationPlan, getRectificationPlanTotal} from '@/utils/JsonTools';
import UploadPlus from '@/components/UploadPlus/index.vue';
import {getNowMilliSecond} from "@/utils/common";

export default {
  name: 'Total',
  components: { UploadPlus },
  data() {
    return {
      mulite:false,
      // 表单标题内容宽度设置
      labelCol: { span: 24 },
      wrapperCol: { span: 24},
      ruleForm: {},
      // 表单规则
      rules: {
        fileList: [{ required: true, message: '请上传文件', trigger: 'blur' }],
        phone: [{ required: true, message: '请输入联系电话', trigger: 'blur' }],
        editor: [{ required: true, message: '请输入编辑人', trigger: 'blur' }],
      },
      fileList: [],
    };
  },
  mounted(){
    this.getInfos()
  },
  methods: {
    // 上传验证
    beforeFileUpload(file) {
      if (file.name.substring(0, file.name.indexOf('.')).length > 200) {
        this.$message.error('上传文件名字不得超过200字');
        return false;
      }
      let isLt2M = file.size / 1024 / 1024;
      if (isLt2M > 200) {
        this.$message.error('只允许上传200M以下的文件');
        return false;
      }
      let fileExt = file.name.slice(file.name.lastIndexOf('.') + 1);
      let fileTypeArr = ['doc','docx','pdf','xls','xlsx','jpg','png','jpeg','txt','ext'];
      if (fileTypeArr.indexOf(fileExt) === -1) {
        this.$message.error('非法的文件类型');
        return false;
      }
      return true;
    },
    handleRemove(){
     this.ruleForm.fileList=[]
    },
    customUpload(file) {
      // beforeFileUpload()返回为true，才会触发这个方法；
      this.handleUpload(file);
    },
    // 构造formData
    handleUpload(file) {
      // const formData = new FormData()
      // let timestamp = new Date().getTime()
      // formData.append('files', file)
      // formData.append('fileUid', file.uid)
      // formData.append('totalBytes', file.size)
      // formData.append('time', timestamp)
      // this.imagerAdd(formData)
      getuploadFileInfo(file.file).then(res => {
        file.onSuccess(res)
        // eslint-disable-next-line no-unused-expressions
        this.ruleForm.fileList =[]
        this.ruleForm.fileList.push(res)
        this.save()
      });
    },
    getInfos(){
      getRectificationPlanTotal().then(res=>{
        console.log("pp--",res)
        this.ruleForm=res
      })
    },
    save () {
      this.$refs.ruleForm1.validate(valid => {
        // eslint-disable-next-line eqeqeq

        if (valid) {
          addRectificationPlan(this.ruleForm).then(res => {
            if (res === 0) {
              this.$message.error('保存失败')
              return
            }
            this.$message.success('保存成功')
          })
        }
      })
    },
  },
};
</script>
<style scoped lang="less">
/deep/ .ant-form-item-label {
  width: 176px;
}

/deep/ .ant-input {
  width: 260px
}
</style>
